<template>
	<div>
		<div class="area">
			<!-- <van-search placeholder="搜索关键字" @change='onSearch' @focus='showkeywords=true' v-model="searchData"></van-search> -->
			<!-- <div class="keywords" v-if="showkeywords">
				<van-button type="default" @click='showkeywords=false' v-show="name">设备名称</van-button>
				<van-button type="default" @click='showkeywords=false'>设备编号</van-button>
				<van-button type="default" @click='showkeywords=false' v-show="showDepartment">保养员/部门</van-button>
				<van-button type="default" @click='showkeywords=false' v-show="keep">保养单号</van-button>

			</div> -->
			<van-cell is-link="" v-for="(item,i) in deviceList" :key='i' :center = 'true' @click='goNext(item.facilityname)'>
				<div class="title" slot='title'>
					<span class="sort">{{i+1}}</span>
					<div class="deviceInfo">
						<div class="deviceNum">{{item.id}}</div>
						<div class="deviceName">{{item.facilityname}}</div>
					</div>
				</div>
			</van-cell>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				showkeywords:false,
				keep:false,
        name:true,
        department:true,
		  searchData:''
			}
		},
    created() {
    },
		methods:{
			onSearch(){

			},
			goNext(facilityname){
				this.$emit('goNext',facilityname)
			}
		},
    props:['showDepartment','deviceList']

	}
</script>

<style scoped="scoped">
	.van-button{
		color: #777;
	}
	.van-button--default{
		border: none;
	}
	.keywords{
		font-size: .8rem;
		color: #999999;
		margin-bottom: .8rem;
	}
	.addImg{
		vertical-align: middle;
		width: 1.4rem;
		height: 1.4rem;
	}
	.h6{
		font-size: .87rem;
		margin: 0;
		margin-top: .7rem;
		padding: .5rem .7rem;
	}
	.deviceNum{
		color: #333333;
		font-size: .87rem;
		font-weight: 700;
		height: 1.5rem;
		line-height: 1.5rem;
	}
	.title{
		display: flex;
		align-items: center;
	}
	.title .sort{
		color: #888888;
		font-size: .85rem;
		width: 3rem;
		text-align: center;
	}
	.title .deviceInfo{
		flex: 7;
	}
</style>
